const stylePosition = (wrapType, type, position, fillType) => {
  let res = {};
  if (["text"].includes(wrapType)) {
    if (type == "wrap") {
      res = {
        ...res,
        width: "100%",
        hegiht: "calc(100vh - 56px - 40px - 54px)",
        "overflow-y": "auto",
        "overflow-x": "hidden",
      };
      if (fillType == "table") {
        res["overflow-y"] = "hidden";
      }
    } else if (type == "header") {
      res = {
        ...res,
        position: "sticky",
        top: "0px",
        background: "#ffffff",
        "z-index": 1,
      };
    } else if (type == "table") {
      res["overflow-y"] = "auto";
      res["max-height"] = "calc(100vh - 56px - 44px - 54px - 106px)";
    }
  } else if (["picture"].includes(wrapType)) {
    if (type == "img") {
      res = {
        ...res,
        width: "100%",
        hegiht: "calc(100vh - 56px - 40px - 54px)",
        "overflow-y": "auto",
        "overflow-x": "hidden",
      };
    }
  } else if (["textAndPicture"].includes(wrapType)) {
    if (type == "wrap") {
      res = {
        ...res,
        width: "100%",
        "overflow-y": "auto",
        "overflow-x": "hidden",
        padding: "0px 12px 12px 12px",
      };
      if (fillType && fillType == "table") {
        res["overflow-y"] = ["left", "right"].includes(position) && fillType ? "auto" : "hidden";
      }
      res["height"] = ["left", "right"].includes(position)
        ? "calc(100vh - 56px - 40px - 54px)"
        : "calc(60vh - 56px - 24px - 54px)";
    } else if (type == "header") {
      res = {
        ...res,
        position: "sticky",
        top: "0px",
        background: "#ffffff",
        "z-index": 1,
      };
    } else if (type == "img") {
      res = {
        ...res,
        "margin-top": "12px",
      };
      res["width"] = ["left", "right"].includes(position) ? "" : "100%";
      res["height"] = ["left", "right"].includes(position)
        ? "calc(100vh - 56px - 40px - 54px)"
        : "calc(50vh - 56px - 40px - 54px)";
    } else if (type == "table") {
      if (["left", "right"].includes(position)) {
        res["max-height"] = "calc(100vh - 246px)";
      } else if (["top", "bottom"].includes(position)) {
        res["max-height"] = "calc(40vh - 40px)";
      }
    }
  }
  return res;
};
export { stylePosition };
